<template>
	<view class="page">
		<!-- 订单状态 -->
		<view class="order-status">
			<view class="status">
				<text class="iconfont icon-zhuyi"></text>
				<text v-if= 'this.order.status == 0'>
					待付款
				</text>
				<text v-if= 'this.order.status == 1'>
					待发货
				</text>
				<text v-if= 'this.order.status == 2'>
					待收货
				</text>
				<text v-if= 'this.order.status == 3'>
					待评价
				</text>
				<text v-if= 'this.order.status == 4'>
					交易成功
				</text>
			</view>
			<view class="reason">
				<text>剩余12分68秒</text>
			</view>
		</view>
		<!-- 收货地址 -->
		<view class="shipping-address">
			<view class="name-phone">
				<text class="iconfont icon-dingwei"></text>
				<text>{{order.userName}}</text>
				<text>{{order.phone}}</text>
			</view>
			<view class="address">
				<text>{{order.information}}{{order.address}}</text>
			</view>
		</view>
		<!-- 订单商品 -->
		<view class="order-goods">
			<view class="goods-list">
				<view class="list" v-for="(item,index) in shoop" :key="index">
					<view class="thumb">
						<image :src="'/static/img/goods_thumb_0'+(index+1)+'.png'" mode=""></image>
					</view>
					<view class="item">
						<view class="title">
							<text class="one-omit">{{item.goodsName}}</text>
						</view>
						<view class="num-size">
							<text>数量：{{item.goodsQuantity}}</text>
							<text>规格：{{item.goodsAttr}}</text>
						</view>
						<view class="price">
							<text>￥{{item.goodsPrice}}</text>
						</view>
						<view class="order-btn">
							<view class="btn" @click="onApplyAftersales">
								<text>申请售后</text>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="contact">
				<text class="iconfont icon-kefu"></text>
				<text>联系客服</text>
			</view>
		</view>
		<!-- 订单信息 -->
		<view class="order-info">
			<view class="info-list">
				<view class="list">
					<view class="title">订单编号:</view>
					<view class="content">
						<text>{{order.orderId}}</text>
						<text class="btn">复制</text>
					</view>
				</view>
				<view class="list">
					<view class="title">下单时间:</view>
					<view class="content">
						<text>{{order.createTime}}</text>
					</view>
				</view>
				<view class="list">
					<view class="title">支付方式:</view>
					<view class="content">
						<text>在线支付</text>
					</view>
				</view>
				<view class="list">
					<view class="title">配送方式:</view>
					<view class="content">
						<text>普通快递</text>
					</view>
				</view>
				<view class="list">
					<view class="title">配送日期:</view>
					<view class="content">
						<text>2020-11-11</text>
					</view>
				</view>
			</view>
		</view>
		<!-- 订单明细 -->
		<view class="order-details">
			<view class="details-list">
				<view class="list">
					<view class="title">
						<text>商品总额</text>
					</view>
					<view class="price">
						<text>{{order.amount}}</text>
					</view>
				</view>
				<view class="list">
					<view class="title">
						<text>运费</text>
					</view>
					<view class="price">
						<text>+￥{{order.freightPrice}}</text>
					</view>
				</view>
				<view class="list action">
					<view class="title">
						<text>实付款：</text>
					</view>
					<view class="price">
						<text>￥{{order.actualPrice}}</text>
					</view>
				</view>
			</view>
		</view>
		<!-- 底部按钮 -->
		<view class="footer-btn">
			<!-- <view class="del">
				<text>删除订单</text>
			</view> -->
			<view class="btn">
				<text>查看发票</text>
				<text class="action" @click="onclick(order.id,order.actualPrice)" v-if='order.status == 0'>确认付款</text>
				<text class="action" v-else>已付款</text>
			</view>
		</view>
	</view>
</template>

<script>
	import axios from 'axios'
	export default {
		data() {
			return {
				orderid:72,
				order:{},
				shoop:[]
			};
		},
		onLoad(params) {
			this.orderid = params.id
			
		},
		created() {
			// if (this.orderid == 0){
			// 	alert("发生错误")
			// 	uni.navigateTo({
			// 		url: '/pages/MyOrderList/MyOrderList?type='+6,
			// 	})
			// 	return
			// }
			axios.request("http://localhost:8089/order/findorder/"+this.orderid).then(
					res =>{
						if (res.data!=null ){
							this.order=res.data
							console.log(this.order)
						}
					}
				)
			axios.request("http://localhost:8089/order/findshoop/"+this.orderid).then(
				res => {
					this.shoop = res.data
				}
			)
		},
		methods:{
			/**
			 * 售后点击
			 */
			onApplyAftersales(){
				uni.navigateTo({
					url: '/pages/AfterSaleType/AfterSaleType',
				})
			},
			//确认付款点击
			onclick(orderid,zong){
				uni.redirectTo({
					 url: '/pages/CashierDesk/CashierDesk?id='+orderid+'&zong='+zong
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	@import 'OrderDetails.scss';
</style>
